var React = require('react');

var Bheader = require('../widget/Bheader');
var Footer = require('../widget/Footer');
var Xianshi = require('../widget/Xianshi');
var ajax = require('../tools/ajax');
var MsgBox = require('../components/MsgBox');

module.exports = React.createClass({
    getInitialState: function () {
        return {
            theme:"Default", //Default/Blue
            zqProInfo:[],//折扣商品信息
            zqProList:""
        }
    },
    myScroll:"",

    componentDidMount: function () {
        var shopId = localStorage.getItem("shopId");
        this.getzqProByshopId(shopId);
        setTimeout(this.iscroll,500);
    },

    componentDidUpdate() {
        var p=this;
        if(p.myScroll){
            p.myScroll.refresh();
        }
    },
    /**iScroll插件*/
    iscroll(){
        var p =this;
        p.myScroll = new IScroll("#zhekouWrapper",{
            // 默认iscroll会拦截元素的默认事件处理函数，我们需要响应onClick，因此要配置
            preventDefault: false,
            // 禁止缩放
            zoom: false,
            // 支持鼠标事件，因为我开发是PC鼠标模拟的
            mouseWheel: true,
            // 滚动事件的探测灵敏度，1-3，越高越灵敏，兼容性越好，性能越差
            probeType: 3,
            // 拖拽超过上下界后出现弹射动画效果，用于实现下拉/上拉刷新
            bounce: true,
            // 展示滚动条
            scrollbars: false
        });
        p.myScroll.refresh();
        document.addEventListener('touchmove', function(){}, false);
    },

    /**根据店铺ID获取折扣商品*/
    getzqProByshopId(shopId){
        var p = this;
        ajax("POST","getzqProByshopId",{shopid:shopId},function(dt){
            if(dt && dt.success){
                var objs = dt.data;
                p.setState({
                    zqProInfo:objs,
                },()=>{
                    var zqProList = p.state.zqProInfo.map(function(obj,index){
                        var kucunFlag = obj.goods_number > 0 ? true:false;
                        var leftTime = (new Date(obj.discount_end_time)-new Date())/1000;
                        if(leftTime>0 && kucunFlag) {
                            return (
                                <Xianshi key={index} MsgBox={p.MsgBox} fleshNum={p.fleshNum} list_info={obj} leftTime={leftTime}></Xianshi>
                            )
                        }
                    });
                    p.setState({zqProList:zqProList})
                })
            }
        });
    },
    /**修改购物车数量*/
    fleshNum:function(){
        this.refs.bheader.fleshNum();
    },
    /**库存提示*/
    MsgBox(word){
        this.refs.MsgBox.setState({
            type: "no",
            timeout: 1000,
            show: true,
            word: word
        });
    },
    render: function () {
        var p = this;
        var discount_img = localStorage.getItem("discount_img");
        return (
            <div className="main"  id="main">
                <Bheader ref="bheader" theme={this.state.theme} title="限时折扣"></Bheader>
                <div className="container-t noFooter" id="zhekouWrapper">
                    <div style={{minHeight:"31.16rem"}}>
                        <div className="zhek_img">
                            <img src={discount_img} />
                        </div>
                        {p.state.zqProList}
                    </div>
                </div>
                <MsgBox ref="MsgBox"></MsgBox>
            </div>
        )
    }
});
